<%--
  Created by IntelliJ IDEA.
  User: 郭宇轩
  Date: 2020/11/16
  Time: 22:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录PetHub</title>
    <style type="text/css">
        @import url("../static/css/Header.css");
    </style>
    <link rel="Stylesheet" href="../static/css/BodyPart.css" type="text/css" media="screen"/>

    </meta>
</head>
<%@ include file="../MainPage/Header.jsp"%>

<div id="card">
    <a id="cardTitle">登录界面</a>
    <ul>用户：
        <input name="username" id="username" type="text" placeholder="输入用户名"/>
    </ul>
    <ul>密码：
        <input name="password" id="password" type="password" placeholder=""/>
    </ul>

    <ul>验证码
        <input name="VerificationCode" type="text" id="VerificationCode"/>
    </ul>
    <ul id="code">
        <img src="../VerificationCode" alt="点击更换" id="v_code" onclick="changeVerificationCode(this)"/>
        <a id="msg" style="color: red"></a>
    </ul>

    <ul id="subBtn">
        <input id="sub" type="button" onclick="judge()" value="登录" height="120" width="50"/>
    </ul>

    <ul id="reg">
        <a href="Register.jsp">还没有账号？点此注册</a>
    </ul>
</div>

</body>
</html>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
    function changeVerificationCode(img) {
        img.src = "../VerificationCode?time=" + new Date().getTime();
    }

    function judge() {
        var username = document.getElementById("username");
        var password = document.getElementById("password");
        var msg = document.getElementById("msg");
        var VerificationCode = document.getElementById("VerificationCode");
        $.ajax({
            url:"../Login",//请求地址
            type:"post",//请求方式
            data:"username="+username.value+"&password="+password.value+"&VerificationCode="+VerificationCode.value,//发送信息
            dataType:"text",//服务器响应信息类型，不写则为默认
            success:function(responseContent){  //success:function(responseContent)为回调函数   responseContent为接收响应信息
                if(responseContent=="true"){
                    msg.innerText="";
                    window.location.href = "../index.jsp";
                }else if(responseContent =="false username"){
                    msg.innerText ="用户名不存在！";
                    document.getElementById("username").select();
                }else if(responseContent =="false password"){
                    msg.innerText ="密码错误！";
                    document.getElementById("password").select();
                }else{
                    msg.innerText ="验证码错误！";
                    changeVerificationCode(document.getElementById("v_code"));
                    document.getElementById("VerificationCode").select();
                }
            },
            error:function () {
                alert("error!");
            }
        });
    }
</script>